:root {
    --easeInOutQuad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
}

/* ---- particles.js container ---- */
#particles-js {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../img/misc/grid-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

/* ---- stats.js ---- */

.js-count-particles {
    font-size: 1.1em;
}

#stats,
.count-particles {
    -webkit-user-select: none;
}

#stats {
    border-radius: 3px 3px 0 0;
    overflow: hidden;
}

.count-particles {
    border-radius: 0 0 3px 3px;
}

/* Hero */
.hero .container {
    position: relative;
    z-index: 10;
}

.hero-content h1 span {
    animation: neonGlow 2s infinite alternate var(--easeInOutQuad);
}

@keyframes neonGlow {
    0% {
        text-shadow: 0 0 10px rgba(255,255,255,.8), 0 0 20px rgba(255,255,255,.8), 0 0 22px rgba(32, 139, 244,.8), 0 0 40px rgba(32, 139, 244,.8), 0 0 50px rgba(32, 139, 244,.8), 0 0 70px rgba(32, 139, 244,.5), 0 0 80px rgba(32, 139, 244,.5), 0 0 120px rgba(32, 139, 244,.5), 0 0 180px rgba(32, 139, 244,.5);
    }

    100% {
        text-shadow: 0 0 2px rgba(255,255,255,.8), 0 0 8px rgba(255,255,255,.8), 0 0 10px rgba(255,255,255,.8), 0 0 10px rgba(32, 139, 244,.8), 0 0 20px rgba(32, 139, 244,.8), 0 0 30px rgba(32, 139, 244,.8), 0 0 40px rgba(32, 139, 244,.5), 0 0 70px rgba(32, 139, 244,.5);
    }
}